<!DOCTYPE html>
<html class="x-admin-sm">
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-X-admin2.1</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="__ADMIN__/css/font.css">
    <link rel="stylesheet" href="__ADMIN__/css/xadmin.css">
    <script type="text/javascript" src="__ADMIN__/js/jquery.min.js"></script>
    <script type="text/javascript" src="__ADMIN__/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="__ADMIN__/js/xadmin.js"></script>
    <script type="text/javascript" src="__ADMIN__/js/cookie.js"></script>
  </head>
  
  <body>
    <div class="x-body x-admin">
        <form class="layui-form layui-form-pane">
            <input type="hidden" name="id" value="{$groups.id}">
            <div class="layui-form-item">
                <label for="name" class="layui-form-label">
                    角色名
                </label>
                <div class="layui-input-inline">
                    <label class="layui-form-label" style="margin-left: 10px;background-color: #5FB878;color:#ffffff;">{$groups.title}</label>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">
                    拥有权限
                </label>
                <div class="layui-table-body layui-table-main" style="width: 100%;">
                    <table class="layui-table layui-form">
                        <thead style="border-bottom: #5FB878 3px solid;">
                            <tr>
                                <th>
                                    <label style="padding-right: 15px;margin-bottom: 0;">
                                        <div class="layui-unselect header layui-form-checkbox" id="checkAll" lay-skin="primary" data-id=''><i class="layui-icon">&#xe605;</i></div>
                                        <span class="text">权限全选</span>
                                    </label>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            {foreach name="ruleRes" item="vo"}
                            <tr>
                                <td>
                                    <div class="layui-unselect layui-form-checkbox <?php if(in_array($vo['id'], $rules)){ echo 'layui-form-checked';} ?>" lay-skin="primary" data-id="{$vo.id}" dataid="id-{$vo.id}-{$vo.id}"><i class="layui-icon">&#xe605;</i></div>
                                    <span class="text">{$vo.title}</span>
                                </td>
                            </tr>
                                {foreach name="vo['children']" item="vo2"}
                                <tr>
                                    <td style="padding-left: 40px;">
                                        <div class="layui-unselect layui-form-checkbox <?php if(in_array($vo2['id'], $rules)){ echo 'layui-form-checked';} ?>" lay-skin="primary"  data-id="{$vo2.id}" dataid="id-{$vo.id}-{$vo.id}-{$vo2.id}"><i class="layui-icon">&#xe605;</i></div>
                                        <span class="text">{$vo2.title}</span>
                                    </td>
                                </tr>
                                    {if condition="$vo2['children']"}
                                    <tr>
                                        <td style="padding-left: 80px;">
                                            {foreach name="vo2['children']" item="vo3"}
                                                <div class="layui-unselect layui-form-checkbox <?php if(in_array($vo3['id'], $rules)){ echo 'layui-form-checked';} ?>" lay-skin="primary" data-id="{$vo3.id}" dataid="id-{$vo.id}-{$vo.id}-{$vo2.id}-{$vo3.id}"><i class="layui-icon">&#xe605;</i></div>
                                                <span class="text">{$vo3.title}</span>
                                            {/foreach}
                                        </td>
                                    </tr>
                                    {/if}
                                {/foreach}
                            {/foreach}
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="layui-form-item">
                <button class="layui-btn" lay-submit="" lay-filter="add">确定分配</button>
            </div>
        </form>
    </div>
    <script>
        /* 权限配置 */
        $(function () {
            //初始勾选全选
            var checkAll = $(".layui-unselect.layui-form-checkbox:not(.header)").length;
            var checkboxNum = $(".layui-unselect.layui-form-checkbox.layui-form-checked").length;
            if(checkAll == checkboxNum){
                $("#checkAll").attr("class","layui-unselect header layui-form-checkbox layui-form-checked");
            }
            //动态选择框，上下级选中状态变化
            $('.layui-form-checkbox:not(.header)').click(function(){
                var dataid = $(this).attr("dataid");
                if($(this).attr('class') == 'layui-unselect layui-form-checkbox'){
                    $('div[dataid^=' + dataid + ']').attr('class','layui-unselect layui-form-checkbox');
                }else{
                    $('div[dataid^=' + dataid + ']').attr('class','layui-unselect layui-form-checkbox layui-form-checked');
                }
                
            });
        });

        layui.use(['form','layer'], function(){
            $ = layui.jquery;
            var form = layui.form
            ,layer = layui.layer;
            
            //监听提交
            form.on('submit(add)', function(data){
                var rule = tableCheck.getData();
                $.ajax({
                    type:'POST',
                    dataType:'json',
                    data:{id:data.field.id,rule:rule},
                    url:"{:url('AuthGroup/power')}",
                    success:function(obj){
                      layer.alert(obj.msg, {icon: obj.icon},function(){
                        // 获得frame索引
                        var index = parent.layer.getFrameIndex(window.name);
                        //关闭当前frame
                        parent.layer.close(index);
                        // 可以对父窗口进行刷新 
                        x_admin_father_reload();
                      });
                    }
                });
                return false;
            });

        });
    </script>
  </body>

</html>